<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<!DOCTYPE html>
<html>
<head>
	<title>查看考试科目</title>
	<!-- jqprint打印功能 -->
	<script type="text/javascript" src="${pageContext.request.contextPath}/static/lib/jquery.jqprint-0.3.js"></script>
	<script type="text/javascript" src="http://code.jquery.com/jquery-migrate-1.1.0.js"></script>
</head>
<body class="skin-2">
			<div class="main-content">
				<!-- #section:basics/content.breadcrumbs -->
				<div class="breadcrumbs" id="breadcrumbs">
					<script type="text/javascript">
						try{ace.settings.check('breadcrumbs' , 'fixed')}catch(e){}
					</script>

					<ul class="breadcrumb">
						<li>
							<i class="ace-icon fa fa-home home-icon"></i>
							<a>查看考试科目</a>
						</li>
					</ul><!-- /.breadcrumb -->

					<!-- #section:basics/content.searchbox -->
					<div class="nav-search" id="nav-search">
						<form class="form-search">
							<span class="input-icon">
								<input type="text" placeholder="Search ..." class="nav-search-input" id="nav-search-input" autocomplete="off" />
								<i class="ace-icon fa fa-search nav-search-icon"></i>
							</span>
						</form>
					</div><!-- /.nav-search -->

					<!-- /section:basics/content.searchbox -->
				</div>

				<!-- /section:basics/content.breadcrumbs -->
				<div class="page-content">
					<!-- #section:settings.box -->
					<div class="ace-settings-container" id="ace-settings-container">
						<div class="btn btn-app btn-xs btn-warning ace-settings-btn" id="ace-settings-btn">
							<i class="ace-icon fa fa-cog bigger-150"></i>
						</div>

						<div class="ace-settings-box clearfix" id="ace-settings-box">
							<div class="pull-left width-50">
								<!-- #section:settings.skins -->
								<div class="ace-settings-item">
									<div class="pull-left">
										<select id="skin-colorpicker" class="hide">
											<option data-skin="no-skin" value="#438EB9">#438EB9</option>
											<option data-skin="skin-1" value="#222A2D">#222A2D</option>
											<option data-skin="skin-2" value="#C6487E">#C6487E</option>
											<option data-skin="skin-3" value="#D0D0D0">#D0D0D0</option>
										</select>
									</div>
									<span>&nbsp; Choose Skin</span>
								</div>

								<!-- /section:settings.skins -->

								<!-- #section:settings.navbar -->
								<div class="ace-settings-item">
									<input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-navbar">
									<label class="lbl" for="ace-settings-navbar"> Fixed Navbar</label>
								</div>

								<!-- /section:settings.navbar -->

								<!-- #section:settings.sidebar -->
								<div class="ace-settings-item">
									<input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-sidebar">
									<label class="lbl" for="ace-settings-sidebar"> Fixed Sidebar</label>
								</div>

								<!-- /section:settings.sidebar -->

								<!-- #section:settings.breadcrumbs -->
								<div class="ace-settings-item">
									<input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-breadcrumbs">
									<label class="lbl" for="ace-settings-breadcrumbs"> Fixed Breadcrumbs</label>
								</div>

								<!-- /section:settings.breadcrumbs -->

								<!-- #section:settings.rtl -->
								<div class="ace-settings-item">
									<input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-rtl">
									<label class="lbl" for="ace-settings-rtl"> Right To Left (rtl)</label>
								</div>

								<!-- /section:settings.rtl -->

								<!-- #section:settings.container -->
								<div class="ace-settings-item">
									<input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-add-container">
									<label class="lbl" for="ace-settings-add-container">
										Inside
										<b>.container</b>
									</label>
								</div>

								<!-- /section:settings.container -->
							</div><!-- /.pull-left -->

							<div class="pull-left width-50">
								<!-- #section:basics/sidebar.options -->
								<div class="ace-settings-item">
									<input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-hover">
									<label class="lbl" for="ace-settings-hover"> Submenu on Hover</label>
								</div>

								<div class="ace-settings-item">
									<input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-compact">
									<label class="lbl" for="ace-settings-compact"> Compact Sidebar</label>
								</div>

								<div class="ace-settings-item">
									<input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-highlight">
									<label class="lbl" for="ace-settings-highlight"> Alt. Active Item</label>
								</div>

								<!-- /section:basics/sidebar.options -->
							</div><!-- /.pull-left -->
						</div><!-- /.ace-settings-box -->
					</div>
					<!-- /.ace-settings-container -->
					<!-- /section:settings.box -->
					
					<!-- /section:settings.box -->
					<div class="page-content-area">
						<div class="row">
							<div class="col-xs-12">
								<!-- PAGE CONTENT BEGINS -->
								<div class="row">
									<div class="col-xs-12 table-responsive">
										<table id="sample-table-1" class="table table-condensed table-bordered table-hover">
											<thead>
												<tr>
													<th>科目名称</th>
													<th>考试状态</th>
													<th>是否已参考</th>
													<th>时间</th>
													<th>分数</th>
													<th>科目总分</th>
													<th>操作</th>
												</tr>
											</thead>
											<tbody>
												 <c:forEach items="${stdeunt.subjectVOList}" var="subject">
												 	<tr>
												 		<td>
												 			${subject.name}
													 	</td>
													 	<td>
													 		<c:if test="${subject.status == 1}">
													 			<span class="label label-lg label-pink arrowed-right">已开启</span>
													 		</c:if>
													 		<c:if test="${subject.status == 0}">
													 			<span class="label label-lg label-grey arrowed-right">未开启</span>
													 		</c:if>
													 	</td>
													 	<td>
													 		<c:if test="${!empty subject.scoreId}">
													 			<span class="label label-success arrowed">已参考</span>
													 		</c:if>
													 		<c:if test="${empty subject.scoreId}">
													 			<span class="label label-warning">
													 				<i class="ace-icon fa fa-exclamation-triangle bigger-120"></i>未参考
													 			</span>
													 		</c:if>
													 	</td>
													 	<td>
													 		<c:if test="${!empty subject.scoreExamTime}">${subject.scoreExamTime}</c:if>
													 		<c:if test="${empty subject.scoreExamTime}">无</c:if>
													 	</td>
													 	<td>
													 		<c:if test="${!empty subject.score}">${subject.score}</c:if>
													 		<c:if test="${empty subject.score}">无</c:if>
													 	</td>
													 	<td>
													 		${subject.totalScore}
													 	</td>
													 	<td>
													 		<c:if test="${!empty subject.scoreId}">
													 			<a href="javascript:void(0)" title="查看成绩单" class="btn btn-xs btn-primary see-student-score">
																	<i class="glyphicon glyphicon-eye-open"></i>
																</a>
																<!-- 查看成绩单模态框 -->
																<div class="modal fade seeStudentScore" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
																  <div class="modal-dialog" role="document">
																    <div class="modal-content">
																      <div class="modal-header">
																        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
																        	<span aria-hidden="true">&times;</span>
																        </button>
																        <h4 class="modal-title">查看科目成绩</h4>
																      </div>
																      <div class="modal-content" style="padding:10px;">
																       	<div class="modal-body">
																       		<div>
																	       		<label>用户名：</label>
																	       		<span>${stdeunt.name}</span>
																	       	</div>
																	       	<div>
																	       		<label>科目名：</label>
																	       		<span>${subject.name}</span>
																	       	</div>
																	       	<div>
																	       		<label>考试时间：</label>
																	       		<span>${subject.scoreExamTime}</span>
																	       	</div>
																	       	<div>
																	       		<label>得分：</label>
																	       		<span>${subject.score}</span>
																	       	</div>
																       	</div>
																      </div>
																      <div class="modal-footer">
																		 <button class="btn" data-dismiss="modal" aria-hidden="true">关闭</button>
																		 <button class="btn btn-primary scorePrint" >打印</button>
																	  </div>
																    </div>
																  </div>
																</div><!-- 查看成绩单模态框 END-->
													 		</c:if>
													 		<c:if test="${empty subject.scoreId && subject.status == 1}">
													 			<a href="javascript:void(0)" title="进入考试" class="btn btn-xs btn-primary go-to-exam">
																	<i class="glyphicon glyphicon-pencil"></i>
																</a>
																<!-- 进入考试提示模态框 -->
																<div class="modal fade goToExamModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
																  <div class="modal-dialog" role="document">
																    <div class="modal-content">
																      <div class="modal-header">
																        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
																        <h4 class="modal-title">提示：</h4>
																      </div>
																      <div class="modal-body">
																       	<h4>是否确认要参加该科目考试？</h4>
																      </div>
																      <div class="modal-footer">
																      	 <input id="subId" type="hidden" value="${subject.subId}" />
																		 <button class="btn" data-dismiss="modal" aria-hidden="true">取消</button>
																		 <button class="btn btn-primary goToExamModalBtn" >确定</button>
																	  </div>
																    </div>
																  </div>
																</div><!-- 进入考试提示模态框 END-->
													 		</c:if>
													 		<c:if test="${empty subject.scoreId && subject.status == 0}">
													 			<a href="javascript:void(0)" title="考试未开启" class="btn btn-xs btn-default" style="cursor:not-allowed;">
																	<i class="glyphicon glyphicon-lock"></i>
																</a>
													 		</c:if>
													 	</td>
												 	</tr>
												 </c:forEach>
											</tbody>
										</table>
										
									</div><!-- /.span -->
								</div><!-- /.row -->
							
							</div><!-- /.col -->
						</div><!-- /.row -->
					</div><!-- /.page-content-area -->
				</div><!-- /.page-content -->
			</div><!-- /.main-content -->

		<!-- basic scripts -->

		<!--[if !IE]> -->
		<script type="text/javascript">
			window.jQuery || document.write("<script src='${pageContext.request.contextPath}/static/assets/js/jquery.min.js'>"+"<"+"/script>");
		</script>

		<!-- <![endif]-->

		<!--[if IE]>
<script type="text/javascript">
 window.jQuery || document.write("<script src='../assets/js/jquery1x.min.js'>"+"<"+"/script>");
</script>
<![endif]-->
		<script type="text/javascript">
			if('ontouchstart' in document.documentElement) document.write("<script src='${pageContext.request.contextPath}/static/assets/js/jquery.mobile.custom.min.js'>"+"<"+"/script>");
		</script>
		<script src="${pageContext.request.contextPath}/static/assets/js/bootstrap.min.js"></script>

		<!-- page specific plugin scripts -->
		<script src="${pageContext.request.contextPath}/static/assets/js/jquery.dataTables.min.js"></script>
		<script src="${pageContext.request.contextPath}/static/assets/js/jquery.dataTables.bootstrap.js"></script>

		<!-- ace scripts -->
		<script src="${pageContext.request.contextPath}/static/assets/js/ace-elements.min.js"></script>
		<script src="${pageContext.request.contextPath}/static/assets/js/ace.min.js"></script>
		
		<!-- inline scripts related to this page -->
		<script type="text/javascript">
			jQuery(function($) {
				
				//点击查看成绩单按钮
				$(".see-student-score").click(function(){
					$(this).siblings(".seeStudentScore").modal("show");
				})
				
				//点击打印按钮使用jqprint打印modal框内modal-body的内容
				$(".scorePrint").click(function(){
					$(this).parent().siblings(".modal-content").jqprint();
				})
				
				//点击进入考试按钮
				$(".go-to-exam").click(function(){
					$(".goToExamModal").modal("show");
				})
				
				//确定进入考试
				$(".goToExamModal .goToExamModalBtn").click(function(){
					var subId = $(this).siblings("input[id='subId']").val();
					window.location.href = "studentExam?subId=" + subId;
				})
				
				var oTable1 = 
				$('#sample-table-2')
				//.wrap("<div class='dataTables_borderWrap' />")   //if you are applying horizontal scrolling (sScrollX)
				.dataTable( {
					bAutoWidth: false,
					"aoColumns": [
					  { "bSortable": false },
					  null, null,null, null, null,
					  { "bSortable": false }
					],
					"aaSorting": [],
			
					//,
					//"sScrollY": "200px",
					//"bPaginate": false,
			
					//"sScrollX": "100%",
					//"sScrollXInner": "120%",
					//"bScrollCollapse": true,
					//Note: if you are applying horizontal scrolling (sScrollX) on a ".table-bordered"
					//you may want to wrap the table inside a "div.dataTables_borderWrap" element
			
					//"iDisplayLength": 50
			    } );
				/**
				var tableTools = new $.fn.dataTable.TableTools( oTable1, {
					"sSwfPath": "../../copy_csv_xls_pdf.swf",
			        "buttons": [
			            "copy",
			            "csv",
			            "xls",
						"pdf",
			            "print"
			        ]
			    } );
			    $( tableTools.fnContainer() ).insertBefore('#sample-table-2');
				*/
			
			
				$(document).on('click', 'th input:checkbox' , function(){
					var that = this;
					$(this).closest('table').find('tr > td:first-child input:checkbox')
					.each(function(){
						this.checked = that.checked;
						$(this).closest('tr').toggleClass('selected');
					});
				});
			
			
				$('[data-rel="tooltip"]').tooltip({placement: tooltip_placement});
				function tooltip_placement(context, source) {
					var $source = $(source);
					var $parent = $source.closest('table')
					var off1 = $parent.offset();
					var w1 = $parent.width();
			
					var off2 = $source.offset();
					//var w2 = $source.width();
			
					if( parseInt(off2.left) < parseInt(off1.left) + parseInt(w1 / 2) ) return 'right';
					return 'left';
				}
			
			});
			$(function () {
			  $('[data-toggle="tooltip"]').tooltip()
			});
			
			
		</script>

		<!-- the following scripts are used in demo only for onpage help and you don't need them -->
		<link rel="stylesheet" href="${pageContext.request.contextPath}/static/assets/css/ace.onpage-help.css" />
		<link rel="stylesheet" href="${pageContext.request.contextPath}/static/docs/assets/js/themes/sunburst.css" />

		<script type="text/javascript"> ace.vars['base'] = '..'; </script>
		<script src="${pageContext.request.contextPath}/static/assets/js/ace/elements.onpage-help.js"></script>
		<script src="${pageContext.request.contextPath}/static/assets/js/ace/ace.onpage-help.js"></script>
		<script src="${pageContext.request.contextPath}/static/docs/assets/js/rainbow.js"></script>
		<script src="${pageContext.request.contextPath}/static/docs/assets/js/language/generic.js"></script>
		<script src="${pageContext.request.contextPath}/static/docs/assets/js/language/html.js"></script>
		<script src="${pageContext.request.contextPath}/static/docs/assets/js/language/css.js"></script>
		<script src="${pageContext.request.contextPath}/static/docs/assets/js/language/javascript.js"></script>
	</body>
</html>